<ion-header [translucent]="true">
	<ion-toolbar>
		<ion-buttons slot="start">
			<ion-menu-button></ion-menu-button>
		</ion-buttons>
		<ion-title>用户</ion-title>
	</ion-toolbar>
</ion-header>

<ion-content [fullscreen]="true">
	<ion-header collapse="condense">
		<ion-toolbar>
			<ion-title size="large">用户</ion-title>
		</ion-toolbar>
	</ion-header>

	<ion-list>
		<ng-container *ngFor="let conn of config.conns">
			<ion-item-divider>
				<ion-label> {{ conn.name }} </ion-label>
				<ion-button slot="end" (click)="add(conn.id)">
					<ion-icon slot="start" name="add-circle"></ion-icon>
					增加
				</ion-button>
			</ion-item-divider>
			<ion-item *ngFor="let user of conn.users">
				<ion-checkbox
					slot="start"
					title="只读"
					disabled="true"
					[(ngModel)]="user.readonly"
				></ion-checkbox>
				<ion-input
					[value]="user.user"
					readonly="true"
					title="数据库登录用户"
				></ion-input>
				<ion-input
					[value]="user.password"
					readonly="true"
					title="数据库登录密码"
				></ion-input>
				<ion-button slot="end" color="danger" (click)="del(user.user, conn.id)">
					<ion-icon slot="start" name="trash"></ion-icon>
					删除
				</ion-button>
			</ion-item>
		</ng-container>
	</ion-list>
</ion-content>
